@use '~@automattic/color-studio/dist/color-variables' as *;

@media print {
  html {
    -ms-overflow-style: -ms-autohiding-scrollbar;
  }

  body {
    background-color: #fff;
  }

  .app-layout__note-column {
    border: 0;
  }

  .dev-badge,
  .app-layout__source-column,
  .tag-field,
  .note-toolbar-wrapper,
  .react-monaco-editor-container,
  .search-results {
    display: none;
  }

  /* Firefox only prints the first page if any divs are display: flex */
  .app,
  .simplenote-app,
  .app-layout,
  .app-layout__note-column,
  .note-editor,
  .note-detail,
  .note-detail-textarea,
  .note-content-editor-shell,
  .note-detail-wrapper {
    display: block;
    overflow: auto;
    position: relative;
  }

  [class^='note-detail-'] {
    max-width: 100%;
    width: 100%;
    color: $studio-black;
    overflow-y: auto !important;
  }

  .note-content-plaintext {
    display: inherit;
  }
}
